<template>
    <div>
        <li v-for="item, index in list " :key="index">
            <div>
                <input type="checkbox" v-model="item.checked">
                <span>{{ item.name }}</span>
            </div>
            <div>
                <button @click="del(index)">删除</button>
            </div>
        </li>
    </div>
</template>

<script>
export default {
   
    props: ['list'],
    data() {
        return {

        };
    },

    mounted() {

    },

    methods: {
        del(index) {
            this.$emit('del', index)
        }
    },
};
</script>

<style lang="scss" scoped>
li {
    width: 300px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
</style>